<template>
    <div>sub vue js</div>
    <div>main view</div>
    <div>{{ store_user.user }}</div>
    <button v-on:click="btnGet">獲取</button>
    <button v-on:click="btn">修改</button>
    <button v-on:click="btnU">修改,调用从主应用传入的方法</button>
</template>

<script setup lang="js">
import { PROJECT_KEY } from '@/config'
import { useUserStore } from '@/stores'
import { ref, getCurrentInstance } from 'vue' //

const user = ref({})

const { proxy } = getCurrentInstance()

const store_user = useUserStore(PROJECT_KEY)

console.log(PROJECT_KEY,"store_user:",store_user)

//user.value = store_user.user

//const store_global = useGlobalStore(PROJECT_KEY)

const btn = ()=>{

    user.value = {
        token :PROJECT_KEY,
        id: '39999',
        account:'',
        mobile:'367744',
        avator: ''
    }

    store_user.setUser(user.value)


    proxy.$setGlobalState({
        useUserStore: store_user.user
    })

    //store_global.syncToMainApp()

    //user.value = store_user.user
    
    // proxy.$onGlobalStateChange((state) => {
    //     console.log('hello',state)
    // })
}

const btnU = ()=>{

user.value = {
    token :PROJECT_KEY,
    id: '3093-40',
    account:'',
    mobile:'1293094',
    avator: ''
}

store_user.setUser(user.value)


store_user.updateFromSubApp()

}

const btnGet = () => {

    //user.value = store_user.user
}



</script>